import React from 'react';
import '../channelManage/channelList.less';
import { Breadcrumb, Icon, Button, Table, Modal, Input, Select, Pagination, message ,Row,Col,DatePicker,Form,Checkbox,AutoComplete,InputNumber,Upload } from 'antd';
import $ from 'jquery';
import Config from '../../common/config';
import convertCurrency from '../commonFunction/convertCurrency';
import getFormatDate from '../commonFunction/getFormatData';
import noRepeat from '../commonFunction/noRepeat';
import moment from 'moment';
const config = new Config();
const { RangePicker } = DatePicker;
const { TextArea } = Input;
const FormItem = Form.Item;
const Option = Select.Option;
const userInfo = JSON.parse(sessionStorage.getItem('UserInfo')); //用户信息
const root = userInfo.root;

class AllRefundList1 extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            visible: false,//我的申请模态框
            dateStr:['',''],//默认今天的日期字符串
            date:['',''],//默认今天的日期
            selectedApplyState:'',//筛选状态
            selectedProduct:'',//筛选产品
            selectedUmbrellaName:'',//筛选平台
            applyPeopleName:'',//筛选负责人姓名
            channelList: [],//申请列表
            channelcount: 0,//申请列表条数
            pageindex:1,//当前页码
            isLooking:false, //是否是查看
            isEdit:false,//是否是编辑
            record:{},//单条记录信息
            allSpentMoney:0,//总消费金额
            allInputLines:1,//总进线
            allOutput:1,//总产值
            lastTImeMoney:0,//上次充值金额
            inputAllMoney:0,//充值总额
            allCharge:0,//总成单金额
            againBoughtMoney:0,//其中复购总值
            moneyLeft:0,//余额
            isRefund:false,//是否为退费
            allAreRefund:false,//是否筛选条件为全部退费
            selectionList:[[],[],[],[]],//筛选列表
            authTreeOfOne:{},//小工具权限
            fileList: [],//图片列表
            previewVisible: false,//预览图片
            previewImage: '',//预览图片
        }
    }
    componentWillMount(){
        console.log(userInfo.auth);
        if(userInfo.auth){
            if(userInfo.auth['橘色小工具']){
                this.setState({
                    authTreeOfOne:userInfo.auth['橘色小工具']
                },()=>{
                    console.log(this.state.authTreeOfOne['/payrequest/save']);
                })
            }
        }

    }
    componentDidMount() {
        //筛选列表
        let selectionList=[[],[],[],[]];
        const {authTreeOfOne}=this.state;
        let url='';
        if(authTreeOfOne['/channel/findonesource']){
            url=`${config.juseLittleTool}/channel/findonesource`
        }
        if(root||(authTreeOfOne['/channel/findsource'])){
            url=`${config.juseLittleTool}/channel/findsource`
        }
        $.ajax({
            url: url,
            type: "post",
            async: true,
            headers: {
                'Authorization': 'Bearer ' + sessionStorage.getItem('token'),
            },
            //data:{user:sessionStorage.getItem('token'),},
            success: data => {
                console.log(data);
                if (data.code === 200) {
                    const List = data.data;
                    if (List.length > 0) {
                        List.forEach((ele, i) => {
                            if(ele.product){
                                selectionList[0].push(ele.product);  //产品
                            }
                            if(ele.umbrellaname){
                                selectionList[1].push(ele.umbrellaname);//平台
                            }
                            if(ele.channelname){
                                selectionList[2].push(ele.channelname);//账户名
                            }
                            if(ele.personincharge){
                                selectionList[3].push(ele.personincharge);//负责人
                            }
                        });
                        this.setState({
                            selectionList:[noRepeat(selectionList[0]),noRepeat(selectionList[1]),noRepeat(selectionList[2]),noRepeat(selectionList[3]),]
                        },()=>{
                            console.log(this.state.selectionList);
                        })
                    }

                }
            }
        });
        //时间初始化
        let dateStr=getFormatDate(new Date());
        this.setState({
            dateStr:[dateStr,dateStr],
            date:[moment(dateStr),moment(dateStr)],
        });
        this.getBannerList(1,dateStr,dateStr);
    }
    //生日禁用
    disabledDate(val) {
        if (val) {
            return val.valueOf() > Date.now();
        } else {
            return false;
        }
    }
    //banner详细信息对话框（新增/编辑）
    showBannerModal(values,state) {
        //state  1:查看   2:编辑  3:退款
        if(state){
            if(state===1){
                this.setState({
                    isLooking:true,
                    isEdit:false,
                    record:values,
                    isRefund:false,
                },()=>{
                    this.props.form.setFieldsValue({
                        refundmoney:values.refundmoney,//退款
                    });
                })
            }else if(state===2){
                this.setState({
                    isLooking:false,
                    isEdit:true,
                    record:values,
                    isRefund:false,
                })
            }else if(state===3){
                this.setState({
                    isLooking:true,
                    isEdit:false,
                    isRefund:true,
                    record:values,
                })
            }
        }else{
            this.setState({
                isLooking:false,
                isEdit:false,
                isRefund:false,
                record:{},
            })
        }
        if(values){
            this.props.form.setFieldsValue({
                product :values.product,//产品
                umbrellaname : values.umbrellaname,//平台
                channelname : values.channelname,//账户名称
                phone : values.phone,//联系电话
                aboutname : values.aboutname,//平台联系人
                company : values.company,//公司名称
                personincharge : values.personincharge,//责任人
                yesterdayrecharge:values.yesterdayrecharge,//上次充值金额
                rechargesum:values.rechargesum,//充值总额
                consumptionmoney:values.consumptionmoney,//消费金额
                coillnsum:values.coillnsum,//总进线
                coiloutsum:values.coiloutsum,//总推线
                communication:values.communication,//总沟通数
                ordersum:values.ordersum,//总成单数
                issueratio:values.issueratio,//平台出单率
                ordersummoney:values.ordersummoney,//总成单金额
                totalvalueofoutput:values.totalvalueofoutput,//总产值
                recyclesum:values.recyclesum,//复购总值
                balance:values.balance,//余额
                // refundmoney:values.refundmoney,//退款
                averagelinecost:values.averagelinecost==='NaN'?0:values.averagelinecost,
                outputratio:values.outputratio==='NaN'?0:values.outputratio,//产出比
                channelstate:values.channelstate,//状态
            });
            this.setState({
                allSpentMoney:values.consumptionmoney?values.consumptionmoney:0,//总消费金额
                allInputLines:values.coillnsum?values.coillnsum:1,//总进线
                allOutput:values.totalvalueofoutput?values.totalvalueofoutput:1,//总产值
                lastTImeMoney:values.yesterdayrecharge?values.yesterdayrecharge:0,//上次充值金额
                inputAllMoney:values.rechargesum?values.rechargesum:0,//充值总额
                allCharge:values.ordersummoney?values.ordersummoney:0,//总成单金额
                againBoughtMoney:values.recyclesum?values.recyclesum:0,//其中复购总值
                moneyLeft:values.balance?values.balance:0,//余额
            });
            this.setState({
                visible: true,
                BannerId: values.id,
            });
        }else{
            this.setState({
                visible: true,
                BannerId:undefined
            });
        }
    }


    //取消，关闭对话框
    handleCancel() {
        this.props.form.resetFields();
        this.setState({
            visible: false,
        });
        this.setState({
            allSpentMoney:0,//总消费金额
            allInputLines:1,//总进线
            allOutput:1,//总产值
            lastTImeMoney:0,//上次充值金额
            inputAllMoney:0,//充值总额
            allCharge:0,//总成单金额
            againBoughtMoney:0,//其中复购总值
            moneyLeft:0,//余额
        });
    }
    //保存
    saveBanner() {
        if(this.state.isLooking&&!this.state.isRefund){
            this.setState({
                visible: false,
            });
            this.props.form.resetFields();
            return;
        }
        this.props.form.validateFields((err, values)=>{
            if(!err){
                if(this.state.isRefund && values.refundmoney ){
                    const {authTreeOfOne}=this.state;
                    let refundimg=[];
                    if(values.Filedata){
                        values.Filedata.forEach(item=>{
                            refundimg.push(item.response ? item.response.name : item.name);
                        })
                    }
                    let  url1=`${config.juseLittleTool}/channel/refundsave`;
                    if(authTreeOfOne['/channel/refundsave']){
                        url1=`${config.juseLittleTool}/channel/refundsave`
                    }
                    if(root||(authTreeOfOne['/channel/executiverefundstate'])){
                        url1=`${config.juseLittleTool}/channel/executiverefundstate`;//发起退费
                    }
                    $.ajax({
                        url: url1,
                        type: "post",
                        async: true,
                        headers: {
                            'Authorization': 'Bearer ' + sessionStorage.getItem('token'),
                        },
                        data:{
                            //user:sessionStorage.getItem('token'),
                            channelstate:'3',
                            refundmoney:values.refundmoney,
                            id:this.state.record.id,
                            refundimg:JSON.stringify(refundimg),//图片路径
                        },
                        success: data => {
                            console.log(data);
                            if(data.code === 200){
                                this.setState({
                                    visible: false,
                                },()=>{
                                    let dateStr=getFormatDate(new Date());
                                    this.setState({
                                        dateStr:[dateStr,dateStr],
                                        date:[moment(dateStr),moment(dateStr)],
                                    });
                                    this.getBannerList(1,dateStr,dateStr);
                                });
                                this.props.form.resetFields();
                            }else{
                                Modal.warning({
                                    title: '修改失败',
                                    content: `${data.mes}请返回重新操作`,
                                });
                            }
                        }
                    });
                    return;
                }
                console.log(values);
                const {BannerId} = this.state;
                let url,
                    data={
                        product :values.product,//产品
                        umbrellaname : values.umbrellaname,//平台
                        channelname : values.channelname,//账户名称
                        phone : values.phone,//联系电话
                        aboutname : values.aboutname,//平台联系人
                        company : values.company,//公司名称
                        personincharge : values.personincharge,//责任人
                        yesterdayrecharge:values.yesterdayrecharge,//上次充值金额
                        rechargesum:values.rechargesum,//充值总额
                        consumptionmoney:values.consumptionmoney,//消费金额
                        coillnsum:values.coillnsum,//总进线
                        coiloutsum:values.coiloutsum,//总推线
                        communication:values.communication,//总沟通数
                        ordersum:values.ordersum,//总成单数
                        issueratio:values.issueratio,//平台出单率
                        ordersummoney:values.ordersummoney,//总成单金额
                        totalvalueofoutput:values.totalvalueofoutput,//总产值
                        recyclesum:values.recyclesum,//复购总值
                        balance:values.balance,//余额
                        refundmoney:values.refundmoney,//退款
                        channelstate:values.channelstate,//状态
                        //user:sessionStorage.getItem('token'),
                    };
                if(BannerId){
                    url = `${config.juseLittleTool}/channel/update`;
                    data.id = BannerId;
                }else{
                    url = `${config.juseLittleTool}/channel/save`;
                }
                $.ajax({
                    url: url,
                    type: "post",
                    async: true,
                    headers: {
                        'Authorization': 'Bearer ' + sessionStorage.getItem('token'),
                    },
                    data:data,
                    success: data => {
                        console.log(data);
                        if(data.code === 200){
                            this.setState({
                                visible: false,
                            },()=>{
                                let dateStr=getFormatDate(new Date());
                                this.setState({
                                    dateStr:[dateStr,dateStr],
                                    date:[moment(dateStr),moment(dateStr)],
                                });
                                this.getBannerList(1,dateStr,dateStr);
                            });
                            this.props.form.resetFields();
                        }else{
                            Modal.warning({
                                title: '保存失败',
                                content: `${data.mes}请返回重新操作`,
                            });
                        }
                    }
                });
            }else{
                message.error(`请填写必要的信息，再提交`, 2);
            }
        })
    }
    //获取申请列表  starttime, endtime, product（产品）, umbrellaname（平台）, state, people（负责人）, pagesize, pageindex
    getBannerList(pageindex,starttime, endtime,product,umbrellaname,state,people) {
        const{authTreeOfOne}=this.state;
        let url='';
        if(authTreeOfOne['/channel/findonelistnotpaging']){
            url=`${config.juseLittleTool}/channel/findonelistnotpaging`
        }
        if(root||(authTreeOfOne['/channel/findlistnotpaging'])){
            url=`${config.juseLittleTool}/channel/findlistnotpaging`
        }
        $.ajax({
            url: url,
            type: "post",
            async: true,
            headers: {
                'Authorization': 'Bearer ' + sessionStorage.getItem('token'),
            },
            data:{
                //user:sessionStorage.getItem('token'),
                pagesize:15,
                pageindex,
                starttime,
                endtime,
                state:2,//申请状态
                product,//产品
                umbrellaname,//平台
                people,//申请人
            },
            success: data => {
                console.log(data);
                if (data.code === 200) {
                    const channelList = data.data.rows;
                    let channelList1=[];
                    let ele1={};
                    if (channelList.length > 0) {
                        channelList.forEach((ele, i) => {
                            ele.index = i + 1;
                            channelList1.push(ele);
                            if(ele.channelstate==='4'){
                                ele1=JSON.parse(JSON.stringify(ele));
                                ele1.index = i + 1.1;
                                ele1.myState=true;
                                channelList1.push(ele1);
                            }
                        });

                        if(this.state.allAreRefund){
                            channelList1=channelList1.filter(key=>key.myState===true)
                        }
                        this.setState({
                            channelList:channelList1,
                            channelcount: data.data.count,
                        },()=>{
                            console.log(this.state.channelList);
                        });
                    }else{
                        this.setState({
                            channelList:[],
                            channelcount: 0,
                        });
                    }
                } else {
                    message.error(`${data.mes} 请返回重新操作`, 2);
                }
            }
        });
    }
    //分页
    changePage(pageindex) {
        this.setState({
            pageindex
        });
        const { dateStr, date,selectedApplyState, selectedProduct,selectedUmbrellaName,applyPeopleName}=this.state;
        this.getBannerList(pageindex,dateStr[0],dateStr[1],selectedProduct,selectedUmbrellaName,selectedApplyState,applyPeopleName);
    }
    //筛选方法
    handleApplyState(state,value){
        let allAreRefund=false;
        const { dateStr, selectedApplyState, selectedProduct,selectedUmbrellaName,applyPeopleName}=this.state;
        if(state===1){
            this.setState({
                selectedProduct:value,
            })
            this.getBannerList(1,dateStr[0],dateStr[1],value,selectedUmbrellaName,selectedApplyState,applyPeopleName);
        }else if(state===2){
            this.setState({
                selectedUmbrellaName:value,
            })
            this.getBannerList(1,dateStr[0],dateStr[1],selectedProduct,value,selectedApplyState,applyPeopleName);
        }else{
            this.setState({
                applyPeopleName:value,
            })
            this.getBannerList(1,dateStr[0],dateStr[1],selectedProduct,selectedUmbrellaName,selectedApplyState,value);
        }
        this.setState({
            allAreRefund:allAreRefund,
        })
    }
    //日期筛选方法
    changeDate(date, dateStr) {
        this.setState({
            dateStr,
            date,
        });
        const { selectedApplyState, selectedProduct,selectedUmbrellaName,applyPeopleName}=this.state;
        this.getBannerList(1,dateStr[0],dateStr[1],selectedProduct,selectedUmbrellaName,selectedApplyState,applyPeopleName);
    }
    //筛选查询
    doSearch(){
        const { dateStr, date,selectedApplyState, selectedProduct,selectedUmbrellaName,applyPeopleName}=this.state;
        this.getBannerList(1,dateStr[0],dateStr[1],selectedProduct,selectedUmbrellaName,selectedApplyState,applyPeopleName);
    }
    //刷新
    reloadByHand(){
        this.doSearch();
    }
    //只是为了计算总值
    justGetInputValue(state,value){
        // console.log(value);
        //只是为了计算总值
        switch(state){
            case 1://上次充值金额
                this.setState({
                    lastTImeMoney:value?value:0,
                });
                break;
            case 2://充值总额
                this.setState({
                    inputAllMoney:value?value:0,
                });
                break;
            case 3://总成单金额
                this.setState({
                    allCharge:value?value:0,
                });
                break;
            case 4://其中复购总值
                this.setState({
                    againBoughtMoney:value?value:0,
                });
                break;
            case 5://余额
                this.setState({
                    moneyLeft:value?value:0,
                });
                break;
            default:
                break;
        }

    }
    //请输入消费金额变化方法
    handleAllSpentMoney(state,value){
        let countValue=()=>{
            const{allSpentMoney,allInputLines,allOutput}=this.state;
            this.props.form.setFieldsValue({
                avgInputLines:Math.round(isNaN(allSpentMoney/allInputLines)?0:allSpentMoney/allInputLines),
                outputratio:isNaN(allSpentMoney/allOutput)?(0):((allSpentMoney/allOutput).toFixed(2)),
            })
        };
        switch(state){
            case 1://消费总金额
                this.setState({
                    allSpentMoney:value?value:0,
                },()=>{
                    countValue();
                });
                break;
            case 2://总进线
                this.setState({
                    allInputLines:value?value:1,
                },()=>{
                    countValue();
                });
                break;
            case 3://总产值
                this.setState({
                    allOutput:value?value:1,
                },()=>{
                    countValue();
                });
                break;
            default:
                break;
        }


    }
    //预览图片对话框
    previewImg(file){
        this.setState({
            previewImage: file.url || file.thumbUrl,
            previewVisible: true,
        });
    }
    //关闭预览图片对话框
    cancelPreview(){
        this.setState({ previewVisible: false })
    }
    //上传图片
    normFile(e) {
        this.setState({
            fileList: e.fileList
        });
        if (Array.isArray(e)) {
            return e;
        }
        return e && e.fileList;
    };
    //限制用户必须上传图片格式的文件、图片大小
    beforeUpload(file, fileList) {
        let isIMG = file.type.indexOf('image') != -1;
        if (!isIMG) {
            message.config({ top: 50 });
            message.error('您只能上传图片！');
        }
        // let isLt10M = file.size / 1024 / 1024 < 10;
        // if (!isLt10M) {
        //     message.config({ top: 50 });
        //     message.error('您上传的图片大小必须小于10MB！');
        // }
        // return isIMG && isLt10M;
        return isIMG ;
    }
    //打印
    handlePrint(){
        this.printpage();
    }
    printpage() {
        let newstr = `
            <table class="" >
              <caption>发起退费列表</caption>
                  <thead>
                    <tr>
                      <td>创建时间</td>
                      <td>产品</td>
                      <td>品台</td>
                      <td>账户名</td>
                      <td>充值总额</td>
                      <td>消费金额</td>
                      <td>状态</td>
                      <td>总进线</td>
                      <td>平均进线成本</td>
                      <td>总成单金额</td>
                      <td>产出比值</td>
                      <td>总产值</td>
                      <td>其中复购总值</td>
                      <td>余额</td>
                      <td>负责人</td>
                    </tr>
                  </thead>
          <tbody>`;
        newstr += this.printHtml();
        newstr += `</tbody></table>`;
        let wind = window.open("", "newWindow");
        let styleNode=document.createElement('style');
        styleNode.innerHTML=`	table{
        border-collapse: collapse;
        width:100%;
        font-size:12px;
      }
      td {
        text-align:center;
        border: 1px solid #ddd;
      }`;
        wind.document.getElementsByTagName('head')[0].appendChild(styleNode);
        wind.document.body.innerHTML = newstr;
        wind.print();
    }
    printHtml() {
        let str = '';
        this.state.channelList.map(item => {
            str += `<tr>
                <td>${item.createtime}</td>
                <td>${item.product==undefined?'':item.product}</td>
                <td>${item.umbrellaname==undefined?'':item.umbrellaname}</td>
                <td>${item.channelname==undefined?'':item.channelname}</td>
                <td>${item.myState?('-'+item.refundmoney):item.rechargesum==null?'':item.rechargesum}</td>
                <td>${item.myState?'--':item.consumptionmoney==null?'':item.consumptionmoney}</td>
                <td>${item.myState?'退费':item.channelstate == 1 ? '正常' : item.channelstate == 2 ? '滞留' : item.channelstate == 3 ? '退款审核中' : item.channelstate == 4 ? '退款通过' : item.channelstate == 5 ? '退款驳回' : ''}</td>
                <td>${item.myState?'--':item.coillnsum==null?'':item.coillnsum}</td>
                <td>${item.myState?'--':(item.averagelinecost=='NaN'||isNaN(item.averagelinecost))?'':item.averagelinecost}</td>
                <td>${item.myState?'--':item.ordersummoney==null?'':item.ordersummoney}</td>
                <td>${item.myState?'--':item.outputratio==='NaN'||item.outputratio==undefined?'':item.outputratio}</td>
                <td>${item.myState?'--':item.totalvalueofoutput==null?'':item.totalvalueofoutput}</td>
                <td>${item.myState?'--':item.recyclesum==null?'':item.recyclesum}</td>
                <td>${item.myState?'--':item.balance==null?'':item.balance}</td>
                <td>${item.personincharge==undefined?'':item.personincharge}</td>
            </tr>`;
        });
        return str;
    }

    render() {
        //费用预览表格
        const data = [
            {
                title: '创建时间',
                dataIndex: 'createtime',
                width: 170,
                render:(text,record)=><span style={{color:record.myState?'red':''}}>{text}</span>
            },{
                title: '产品',
                dataIndex: 'product',
                width: 120,
                render:(text,record)=><span style={{color:record.myState?'red':''}}>{text}</span>
            },{
                title: '平台',
                dataIndex: 'umbrellaname',
                width: 120,
                render:(text,record)=><span style={{color:record.myState?'red':''}}>{text}</span>
            },{
                title: '账户名',
                dataIndex: 'channelname',
                width: 120,
                render:(text,record)=><span style={{color:record.myState?'red':''}}>{text}</span>
            },{
                title: '充值总额',
                dataIndex: 'rechargesum',
                width: 100,
                render:(text,record)=><span style={{color:record.myState?'red':''}}>{text}</span>
            },{
                title: '消费金额',
                width: 100,
                dataIndex: 'consumptionmoney',
                render:(text,record)=><span >{record.myState?'--':text}</span>
            }, {
                title: '状态',
                width: 100,
                dataIndex: 'channelstate',
                render: (text,record) => <span style={{color:record.myState?'red':''}}>{record.myState?'退费':(text==1?'正常':text==2?'滞留':text==3?'退款审核中':text==4?'退款通过':text==5?'退款驳回':'')}</span>
            } ,{
                title: '总进线',
                width: 100,
                dataIndex: 'coillnsum',
                render:(text,record)=><span >{record.myState?'--':text}</span>
            },{
                title: '平均进线成本',
                width: 100,
                dataIndex: 'averagelinecost',
                render:text=><span>{record.myState?'--':((text=='NaN'||isNaN(text))?'':text)}</span>
            },{
                title: '总成单金额',
                width: 100,
                dataIndex: 'ordersummoney',
                render:(text,record)=><span >{record.myState?'--':text}</span>
            },{
                title: '产出比值',
                width: 100,
                dataIndex: 'outputratio',
                render:text=><span>{record.myState?'--':(text==='NaN'?'':text)}</span>
            },{
                title: '总产值',
                width: 100,
                dataIndex: 'totalvalueofoutput',
                render:(text,record)=><span >{record.myState?'--':text}</span>
            },
            {
                title: '其中复购总值',
                width: 100,
                dataIndex: 'recyclesum',
                render:(text,record)=><span >{record.myState?'--':text}</span>
            },
            {
                title: '余额',
                width: 100,
                dataIndex: 'balance',
                render:(text,record)=><span >{record.myState?'--':text}</span>
            },
            {
                title: '负责人',
                width: 100,
                dataIndex: 'personincharge',
            },{
                title: '操作',
                width: 220,
                render: (text, record) => (
                    <div>
                        {record.createtime==="总计"?'': <div>
                            <Button  onClick={this.showBannerModal.bind(this,record,1)}>查看</Button>
                            {record.channelstate!=2?'':<Button  type="danger" style={{marginTop:'10px'}} onClick={this.showBannerModal.bind(this,record,3)} >发起退费</Button>}
                        </div>}
                    </div>
                )
            }
        ];
        const { getFieldDecorator, } =this.props.form;
        const formItemLayout = { labelCol: { span: 10 }, wrapperCol: { span: 14 }, };
        const{allSpentMoney,allInputLines,visible,  isLooking, isEdit,record,isRefund,selectionList,fileList,previewVisible,previewImage,}=this.state;
        return (
            <div className='goods-label clearfix'>
                {/*面包屑*/}
                < Breadcrumb separator=">" >
                    <Breadcrumb.Item>橘色小工具</Breadcrumb.Item>
                    <Breadcrumb.Item>数据管理</Breadcrumb.Item>
                    <Breadcrumb.Item>发起退费</Breadcrumb.Item>
                </Breadcrumb >
                {/*筛选条*/}
                <div style={{marginTop:'40px'}} className="clearfix">
                    <Row>
                        <Col span={5}>
                            时间:&nbsp;&nbsp;&nbsp;
                            <RangePicker placeholder={['请选择日期', '请选择日期']}
                                         onChange={this.changeDate.bind(this)}
                                         format='YYYY-MM-DD'
                                         value={this.state.date}
                                         style={{width:'180px'}}
                                         disabledDate={(val) => this.disabledDate(val)}
                            />
                        </Col>
                        <Col span={3}>
                            产品:&nbsp;&nbsp;&nbsp;
                            <Select  style={{width:'90px'}} onChange={this.handleApplyState.bind(this,1)} defaultValue="">
                                <Option value='' >全部</Option>
                                {selectionList[0].map(item=><Option value={item} key={item}>{item}</Option>)}
                            </Select>
                        </Col>
                        <Col span={3}>
                            平台:&nbsp;&nbsp;&nbsp;
                            <Select  style={{width:'90px'}} onChange={this.handleApplyState.bind(this,2)} defaultValue="">
                                <Option value='' >全部</Option>
                                {selectionList[1].map(item=><Option value={item} key={item}>{item}</Option>)}
                            </Select>
                        </Col>
                        <Col span={3}>
                            状态:&nbsp;&nbsp;&nbsp;
                            <Select  style={{width:'90px'}} defaultValue="2">
                                <Option value='2'>滞留</Option>
                            </Select>
                        </Col>
                        <Col span={3}>
                            负责人:&nbsp;&nbsp;&nbsp;
                            <Select  style={{width:'90px'}} onChange={this.handleApplyState.bind(this,4)} defaultValue="">
                                <Option value='' >全部</Option>
                                {selectionList[3].map(item=><Option value={item} key={item}>{item}</Option>)}
                            </Select>
                        </Col>
                        <Col span={7}>
                            <Button type="primary" onClick={this.doSearch.bind(this)}>查询</Button>
                            {/*<Button  style={{marginLeft:'10px'}} onClick={this.reloadByHand.bind(this)}>刷新</Button>*/}
                        </Col>
                    </Row>
                    <div ref={(printdiv)=>{this.printdiv = printdiv}} className='allgoods-table clearfix' style={{marginTop:'40px'}}>
                        <Table
                               rowKey="index"
                               columns={data}
                               dataSource={this.state.channelList}
                               pagination={false}
                               bordered
                        />
                    </div>
                </div>
                <Row style={{marginTop:'40px'}} align="bottom">
                    <Col span={2} style={{lineHeight:'52px'}}><Button  onClick={() => { window.location.hash = '/channelList' }}>返回</Button></Col>
                    <Col span={2} style={{lineHeight:'52px'}}><Button type="primary" onClick={this.handlePrint.bind(this)}>打印</Button></Col>
                    <Col span={10} offset={6}>
                        {
                            this.state.bannercount == 0?
                                <p className="floor-ppagip">
                                    共{this.state.channelcount}条记录
                                </p> :
                                <p className="floor-ppagip">
                                    当前显示
                                    {this.state.channelcount===0?0:(15*(this.state.pageindex-1)+1)}—
                                    {15*this.state.pageindex < this.state.channelcount ? 15*this.state.pageindex : this.state.channelcount}条记录，
                                    共{this.state.channelcount}条记录
                                </p>
                        }
                        <Pagination showQuickJumper  current={this.state.pageindex}  defaultPageSize={15} onChange={this.changePage.bind(this)} total={ this.state.channelcount||1}   />
                    </Col>
                </Row>
                <Modal
                    className="little-tool-modal"
                    title={isRefund?'发起退费':"新增数据"}
                    visible={visible}
                    footer={(isLooking&&!isRefund)?null: <div>
                        <Button  onClick={this.handleCancel.bind(this)}>取消</Button>
                        <Button type="primary" onClick={this.saveBanner.bind(this)}>确定</Button>
                    </div>}
                    okText="确定"
                    cancelText="取消"
                    // onOk={this.saveBanner.bind(this)}
                    onCancel={this.handleCancel.bind(this)}
                    maskClosable={false}
                >
                    <Form className="form-color">
                        <Row>
                            <Col span={7} >
                                <FormItem {...formItemLayout} label="产品"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('product', {
                                        rules: [{ required: true, message: '请输入产品名称' },
                                            { pattern: /^\S+$/, message: '请不要输入空格'}],
                                    })(
                                        <AutoComplete disabled={isEdit||isLooking}
                                            // dataSource={this.state.medicalNameDataSource}
                                            // onSearch={this.handleSearch}
                                                      placeholder="请输入产品名称"
                                        />
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={5} >
                                <FormItem {...formItemLayout} label="平台"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('umbrellaname', {
                                        rules: [{ required: true, message: '请输入平台' },
                                            { pattern: /^\S+$/, message: '请不要输入空格'}],
                                    })(
                                        <AutoComplete disabled={isEdit||isLooking}
                                            // dataSource={this.state.medicalNameDataSource}
                                            // onSearch={this.handleSearch}
                                                      placeholder="请输入平台"
                                        />
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={7}>
                                <FormItem {...formItemLayout} label="账户名"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('channelname', {
                                        rules: [{ required: true, message: '请输入账户名' },
                                            { pattern: /^\S+$/, message: '请不要输入空格'}],
                                    })(
                                        <AutoComplete disabled={isEdit||isLooking}
                                            // dataSource={this.state.medicalNameDataSource}
                                            // onSearch={this.handleSearch}
                                                      placeholder="请输入账户名"
                                        />
                                    )}
                                </FormItem>
                            </Col>
                        </Row>
                        <Row>
                            <Col span={7} >
                                <FormItem {...formItemLayout} label="公司"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('company', {
                                        rules: [{ required: true, message: '请输入公司' },
                                            { pattern: /^\S+$/, message: '请不要输入空格'}],
                                    })(
                                        <Input placeholder="请输入公司" disabled={isEdit||isLooking}/>
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={7} offset={5}>
                                <FormItem {...formItemLayout} label="姓名"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('aboutname', {
                                        rules: [{ required: true, message: '请输入姓名' },
                                            { pattern: /^\S+$/, message: '请不要输入空格'}],
                                    })(
                                        <Input placeholder="请输入姓名" disabled={isEdit||isLooking}/>
                                    )}
                                </FormItem>
                            </Col>
                        </Row>
                        <Row>
                            <Col span={7} >
                                <FormItem {...formItemLayout} label="联系方式"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('phone', {
                                        rules: [
                                            { required: true, message: '请输入联系方式' },
                                            { pattern: /^(1[34578]\d{9})$/, message: '请输入正确的手机号' }
                                        ],
                                    })(
                                        <Input placeholder="请输入联系方式" disabled={isEdit||isLooking}/>
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={7} offset={5}>
                                <FormItem {...formItemLayout} label="负责人"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('personincharge', {
                                        rules: [{ required: true, message: '请输入负责人' },
                                            { pattern: /^\S+$/, message: '请不要输入空格'}],
                                    })(
                                        <Input placeholder="请输入负责人" disabled={isEdit||isLooking}/>
                                    )}
                                </FormItem>
                            </Col>
                        </Row>
                        {(isRefund||record.channelstate==3||record.channelstate==4||record.channelstate==5)?<Row>
                            <Col span={7} >
                                <FormItem {...formItemLayout} label="退费金额"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('refundmoney', {
                                        rules: [{ required: true, message: '请输入退费金额' },]
                                    })(
                                        <InputNumber  placeholder={"请输入退费金额"} disabled={isLooking&&!isRefund} style={{width:'100%'}} min={0} step={0.01} precision={2}/>
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={7} offset={7}>
                                <p style={{color: 'rgba(0, 0, 0, 0.85)',fontSize: '14px'}}> 状态:&nbsp;&nbsp;&nbsp;&nbsp;{record.channelstate==3?'退款审核中':record.channelstate==4?'退款通过':record.channelstate==2?'滞留':''}</p>
                            </Col>
                        </Row>:''}
                        <Row>

                            <Col span={7}>
                                <FormItem {...formItemLayout} label="上次充值金额"  style={{ minHeight: '60px', marginBottom: 0 ,}}>
                                    {getFieldDecorator('yesterdayrecharge', {
                                    })(
                                        <InputNumber onChange={this.justGetInputValue.bind(this,1)} placeholder={isLooking?'':"请输入上次充值金额"} disabled={isLooking} style={{width:'100%'}} min={0} step={0.01} precision={2}/>
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={4} className="clearfix">
                                <span  style={{ fontSize:'14px',float:'right' }}>{convertCurrency(isNaN(this.state.lastTImeMoney)?0:this.state.lastTImeMoney)}</span>
                            </Col>
                            <Col span={7} offset={1} >
                                <FormItem {...formItemLayout} label="充值总额"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('rechargesum', {

                                    })(
                                        <InputNumber placeholder={isLooking?'':"请输入充值总额"} disabled={isLooking} style={{width:'100%'}} min={0} step={0.01} precision={2} onChange={this.justGetInputValue.bind(this,2)}/>
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={4} className="clearfix">
                                <span  style={{ fontSize:'14px',float:'right' }}>{convertCurrency(isNaN(this.state.inputAllMoney)?0:this.state.inputAllMoney)}</span>
                            </Col>
                        </Row>
                        <Row>
                            <Col span={7} >
                                <FormItem {...formItemLayout} label="消费金额"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('consumptionmoney', {

                                    })(
                                        <InputNumber placeholder={isLooking?'':"请输入消费金额"} disabled={isLooking} style={{width:'100%'}} min={0} step={0.01} precision={2} onChange={this.handleAllSpentMoney.bind(this,1)}/>
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={4} className="clearfix">
                                <span  style={{ fontSize:'14px',float:'right' }}>{convertCurrency(isNaN(this.state.allSpentMoney)?0:this.state.allSpentMoney)}</span>
                            </Col>
                            <Col span={7} offset={1}>
                                <FormItem {...formItemLayout} label="余额"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('balance', {

                                    })(
                                        <InputNumber  disabled={isLooking} placeholder={isLooking?'':"请输入余额"}  onChange={this.justGetInputValue.bind(this,5)} style={{width:'100%'}} min={0} step={0.01} precision={2} />
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={4} className="clearfix">
                                <span  style={{ fontSize:'14px',float:'right' }}>{convertCurrency(isNaN(this.state.moneyLeft)?0:this.state.moneyLeft)}</span>
                            </Col>
                        </Row>
                        <Row>
                            <Col span={7} >
                                <FormItem {...formItemLayout} label="总进线" style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('coillnsum', {

                                    })(
                                        <InputNumber  disabled={isLooking} placeholder={isLooking?'':"请输入总进线"}  onChange={this.handleAllSpentMoney.bind(this,2)} style={{width:'100%'}} min={0} step={1} precision={0} />
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={7} offset={5}>
                                <FormItem {...formItemLayout} label="平均进线成本" style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('averagelinecost', {
                                    })(
                                        <InputNumber disabled  style={{width:'100%'}} min={0} step={0.01} precision={2} />
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={4} className="clearfix">
                                <span  style={{ fontSize:'14px',float:'right' }}>{((allSpentMoney>0&&allInputLines>0&&allSpentMoney<allInputLines)?'小于1元':convertCurrency((allSpentMoney>0&&allInputLines>0)?Math.round(allSpentMoney/allInputLines):0))}</span>
                            </Col>
                        </Row>

                        <Row>
                            <Col span={7} >
                                <FormItem {...formItemLayout} label="总推线"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('coiloutsum', {
                                    })(
                                        <InputNumber placeholder={isLooking?'':"请输入总推线"} disabled={isLooking} style={{width:'100%'}} min={0} step={0.01} precision={2} />
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={7} offset={5}>
                                <FormItem {...formItemLayout} label="总沟通数"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('communication', {

                                    })(
                                        <InputNumber placeholder={isLooking?'':"请输入总沟通数"} disabled={isLooking} style={{width:'100%'}} min={0} step={0.01} precision={2} />
                                    )}
                                </FormItem>
                            </Col>
                        </Row>
                        <Row>
                            <Col span={7} >
                                <FormItem {...formItemLayout} label="总成单数"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('ordersum', {

                                    })(
                                        <InputNumber placeholder={isLooking?'':"请输入总成单数"} disabled={isLooking} style={{width:'100%'}} min={0} step={0.01} precision={2} />

                                    )}
                                </FormItem>
                            </Col>
                            <Col span={7} offset={5}>
                                <FormItem {...formItemLayout} label="平台出单率"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('issueratio', {
                                    })(
                                        <InputNumber   placeholder={isLooking?'':"请输入平台出单率"} disabled={isLooking} style={{width:'100%'}} min={0} step={0.01} max={100} precision={2} />
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={4}>
                                <span style={{ fontSize:'16px' }}>%</span>
                            </Col>
                        </Row>
                        <Row>
                            <Col span={7} >
                                <FormItem {...formItemLayout} label="总成单金额"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('ordersummoney', {
                                    })(
                                        <InputNumber  disabled={isLooking} placeholder={isLooking?'':"请输入总成单金额"}  onChange={this.justGetInputValue.bind(this,3)} style={{width:'100%'}} min={0} step={0.01} precision={2} />
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={4} className="clearfix">
                                <span  style={{ fontSize:'14px',float:'right' }}>{convertCurrency(isNaN(this.state.allCharge)?0:this.state.allCharge)}</span>
                            </Col>

                            <Col span={7} offset={1}>
                                <FormItem {...formItemLayout} label="产出比值"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('outputratio', {
                                    })(
                                        <Input   disabled/>
                                    )}
                                </FormItem>
                            </Col>
                        </Row>
                        <Row>
                            <Col span={7} >
                                <FormItem {...formItemLayout} label="总产值"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('totalvalueofoutput', {
                                    })(
                                        <InputNumber  disabled={isLooking} placeholder={isLooking?'':"请输入总产值"}  onChange={this.handleAllSpentMoney.bind(this,3)} style={{width:'100%'}} min={0} step={0.01} precision={2} />
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={4} className="clearfix">
                                <span  style={{ fontSize:'14px',float:'right' }}>{convertCurrency(isNaN(this.state.allOutput)?0:this.state.allOutput)}</span>
                            </Col>
                            <Col span={7} offset={1}>
                                <FormItem {...formItemLayout} label="其中复购总值"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('recyclesum', {

                                    })(
                                        <InputNumber  disabled={isLooking} placeholder={isLooking?'':"请输入其中复购总值"}  onChange={this.justGetInputValue.bind(this,4)} style={{width:'100%'}} min={0} step={0.01} precision={2} />
                                    )}
                                </FormItem>
                            </Col>
                            <Col span={4} className="clearfix">
                                <span  style={{ fontSize:'14px',float:'right' }}>{convertCurrency(isNaN(this.state.againBoughtMoney)?0:this.state.againBoughtMoney)}</span>
                            </Col>
                        </Row>
                        {(isRefund||record.channelstate==3||record.channelstate==4||record.channelstate==5)?'':<Row>
                            <Col span={7} >
                                <FormItem {...formItemLayout} label="状态"  style={{ minHeight: '60px', marginBottom: 0 }}>
                                    {getFieldDecorator('channelstate', {
                                        initialValue:'1'
                                    })(
                                        <Select disabled={isLooking}>
                                            <Option value='1'>正常</Option>
                                            <Option value='2'>滞留</Option>
                                            <Option value='3' disabled>退款审核中</Option>
                                            <Option value='4' disabled>退款通过</Option>
                                            <Option value='5' disabled>退款驳回</Option>
                                        </Select>
                                    )}
                                </FormItem>
                            </Col>
                        </Row>}
                        {isRefund?
                            <Row>
                                <Col span={7} >
                                    <FormItem {...formItemLayout} label="上传凭证" style={{ minHeight: '120px', marginBottom: 0 }}>
                                        {getFieldDecorator('Filedata', {
                                            valuePropName: 'fileList', getValueFromEvent: this.normFile.bind(this),
                                        })(
                                            <Upload
                                                method="post"
                                                accept="image/*"
                                                name="Filedata"
                                                action={config.UploadFile + "/uploadpageimg"}
                                                beforeUpload={this.beforeUpload.bind(this)}
                                                listType="picture-card"
                                                className="upload-list-inline"
                                                onPreview={this.previewImg.bind(this)}
                                                showUploadList={{showPreviewIcon: true, showRemoveIcon:true }}
                                            >
                                                {(fileList.length >= 5) ?'':<div>
                                                    <Icon type="plus" />
                                                    <div className="ant-upload-text">点击上传图片</div>
                                                </div>}
                                            </Upload>
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>:''}
                        { record.channelstate==3||record.channelstate==4?<Row>
                            <Col span={22} offset={1} >
                                <span style={{color: 'rgba(0, 0, 0, 0.85)',fontSize:'14px'}}>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;凭据照片：</span>
                                {
                                    record.refundimg?(JSON.parse(record.refundimg)).length ? (JSON.parse(record.refundimg)).map((item,i)=>{
                                        return <a href={config.Filepath + item} target="_blank" key={i} style={{marginRight:'20px'}}>
                                            <img src={config.Filepath +item} style={{ height: "100px", width: "160px" ,verticalAlign:'top'}} />
                                        </a>
                                    }):<span style={{color:'red'}}>未上传凭据图片</span>:<span style={{color:'red'}}>未上传凭据图片</span>
                                }
                            </Col>
                        </Row>:''}
                        {JSON.stringify(this.state.record)==='{}'?'': <Row>
                            <Col span={10} offset={2}>
                                <p>录入时间：{record.createtime.split(' ')[0]}</p>
                            </Col>
                            <Col span={10} offset={2}>
                                <p>上次更新时间：{record.updatetime}</p>
                            </Col>
                        </Row>}
                    </Form>
                </Modal>
            </div>
        )
    }
}
const AllRefundList = Form.create()(AllRefundList1);
export default AllRefundList;